<template>
    <div>
        <!-- 导航栏 -->
        <div>
            <van-nav-bar left-arrow class="ys">
                <!-- 我的 -->
                <template #left>
                    <router-link to="/wode">
                        <van-icon name="manager" size="18" class="yc" />
                    </router-link>
                </template>
                <!-- 标题 -->
                <template #title>
                    <span class="yc"> 源单词</span>
                </template>
                <!-- 搜索 -->
                <template #right>
                    <router-link to="/home/shousuo">
                        <van-icon name="search" size="18" class="yc" />
                    </router-link>
                </template>
            </van-nav-bar>
        </div>
        <!-- 子路由 -->

        <router-view></router-view>

        <!-- 标签页 -->
        <div>
            <van-tabbar route>
                <van-tabbar-item icon="home-o" replace to="/home/xuexi">学习</van-tabbar-item>
                <van-tabbar-item icon="orders-o" repalce to="/home/danciben">单词本</van-tabbar-item>
                <van-tabbar-item icon="setting-o" repalce to="/home/shezhi">设置</van-tabbar-item>
            </van-tabbar>
        </div>
    </div>
</template>

<script>

export default {
    data() {
        return {


        };
    },
    methods: {

    }
}

</script>

<style lang="less" scoped>
.ys {
    background-color: #39a9ed;
}

.yc {
    color: white;
}
</style>